<script setup>
import {ref, onMounted, computed, reactive} from 'vue'
import {useRouter} from "vue-router";
import {useCaseStore} from "@/stores/caseStore.js";
import {ElMessage} from "element-plus";

const router = useRouter();
const caseStore = useCaseStore();


const form = reactive({
  caseName: '',
  caseType: '',
})


onMounted(()=>{
  const currentCase = caseStore.getCase()
  if(currentCase){
    form.caseName = currentCase.caseName
    form.caseType = currentCase.caseType
  }
})

const handleSubmit = () => {
  caseStore.updateCase({
    caseName: form.caseName,
    caseType: form.caseType,
  })

  ElMessage.success("更新成！")
  router.back();

}

</script>

<template>
<div>
  <el-button size="small" @click="router.back()"> 返回</el-button>
  <!-- 案件编辑界面-->
  <el-row>
    <el-col :span="12">
     <el-input v-model="form.caseName" placeholder="请输入案件名称" />
    </el-col>
    <el-col :span="12">
      <el-select v-model="form.caseType" placeholder="请选择案件类型">
        <el-option label="民事案件" value="1" />
        <el-option label="刑事案件" value="2" />
      </el-select>
    </el-col>
    <el-col :span="12">
      <el-input v-model="form.caseDesc" placeholder="请输入案件描述" />
    </el-col>
    <el-col :span="12">
      <el-input v-model="form.caseAmount" placeholder="请输入案件金额" />
    </el-col>
    <el-col :span="12">
      <el-button type="primary" @click="handleSubmit">提交</el-button>
    </el-col>
  </el-row>

</div>
</template>

<style scoped>

</style>